<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>

<div id='container'>
    <div id='element'></div>
</div>

<script>

var container = document.getElementById('container');
var element = document.getElementById('element');

test(function() {
    assert_equals(document.timeline.getAnimations().length, 0);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 0);

    var animation = element.animate([], 1000);
    assert_equals(document.timeline.getAnimations().length, 1);
    assert_equals(document.timeline.getAnimations()[0], animation);

    var animation2 = container.animate([], 1000);
    assert_equals(document.timeline.getAnimations().length, 2);
    assert_equals(document.timeline.getAnimations()[0], animation);
    assert_equals(document.timeline.getAnimations()[1], animation2);

    animation.finish();
    assert_equals(document.timeline.getAnimations().length, 1);
    assert_equals(document.timeline.getAnimations()[0], animation2);

    animation2.finish();
    assert_equals(document.timeline.getAnimations().length, 0);
}, 'Timeline getAnimations()');

test(function() {
    assert_equals(document.timeline.getAnimations().length, 0);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 0);

    var animation = element.animate([], 1000);
    assert_equals(document.timeline.getAnimations().length, 1);
    assert_equals(document.timeline.getAnimations()[0], animation);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 1);
    assert_equals(element.getAnimations()[0], animation);

    var animation2 = container.animate([], 1000);
    assert_equals(document.timeline.getAnimations().length, 2);
    assert_equals(document.timeline.getAnimations()[0], animation);
    assert_equals(document.timeline.getAnimations()[1], animation2);
    assert_equals(container.getAnimations().length, 1);
    assert_equals(container.getAnimations()[0], animation2);
    assert_equals(element.getAnimations().length, 1);
    assert_equals(element.getAnimations()[0], animation);

    animation.finish();
    assert_equals(document.timeline.getAnimations().length, 1);
    assert_equals(document.timeline.getAnimations()[0], animation2);
    assert_equals(container.getAnimations().length, 1);
    assert_equals(container.getAnimations()[0], animation2);
    assert_equals(element.getAnimations().length, 0);

    animation2.finish();
    assert_equals(document.timeline.getAnimations().length, 0);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 0);

}, 'Animatable getAnimations()');

test(function() {
    assert_equals(document.timeline.getAnimations().length, 0);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 0);

    var animation = element.animate([], {duration: 1000, delay: 500});
    assert_equals(document.timeline.getAnimations().length, 1);
    assert_equals(document.timeline.getAnimations()[0], animation);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 1);
    assert_equals(element.getAnimations()[0], animation);

    animation.finish();
    assert_equals(document.timeline.getAnimations().length, 0);
    assert_equals(container.getAnimations().length, 0);
    assert_equals(element.getAnimations().length, 0);

}, 'getAnimations() with delays');

</script>
